<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <title></title>
  
  <link rel="stylesheet" href="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css">
  
  <!-- Extra Codiqa features -->
  <link rel="stylesheet" href="codiqa.ext.css">
  
  <!-- jQuery and jQuery Mobile -->
  <script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script>
  <script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>

  <!-- Extra Codiqa features -->
  <script src="https://d10ajoocuyu32n.cloudfront.net/codiqa.ext.js"></script>
  
  <!--other javascript codes--> 
  <script type="text/javascript">
  var curTrainNo = "";
  var destStatnNo = "";

  $(document).on('pageinit',function(){
  	//alert("pageinit");
	$('#trainInfo').html("");    
  });
  
  function setStatnInfo(html){
  	//alert('setStatnInfo');
  	$('#trainInfo').html(html);

	alert($('#trainInfo div.ui-block-b, div.ui-block-c').length);
	$('#trainInfo div.ui-block-b, div.ui-block-c').click(function(){
		setCurTrainNo($(this).data("subwayid"), $(this).data("statnid"), $(this).attr("class") == "ui-block-b" ? "하행" : "상행");
	});

  }
  
  function setCurTrainNo(subwayId, statnId, direction){
  	alert("statnId"+statnId);
  	var bigStr = "{'subwayId':'"+subwayId + "','statnId':'"+statnId+"','direction':'"+direction+"'}";
  	//window.android.setCurTrainNo(subwayId, statnId, direction);
  	window.android.setCurTrainNo(bigStr);
  }
  </script> 
</head>
<body">
<!-- Home -->
<div data-role="page" id="page-home">
    <div data-role="content">
        <div data-role="fieldcontain">
            <label for="selectmenu1">
                Choose Subway Line No.:
            </label>
            <select id="selectmenu1" name="lineNo" data-theme="b" onchange="window.android.getStatnByRoute(this.options[this.selectedIndex].value)">
                <option value="1001">
                    1호선
                </option>
                <option value="1002">
                    2호선
                </option>
                <option value="1003">
                    3호선
                </option>
                <option value="1004">
                    4호선
                </option>
                <option value="1005">
                    5호선
                </option>
                <option value="1006">
                    6호선
                </option>
                <option value="1007">
                    7호선
                </option>
                <option value="1008">
                    8호선
                </option>
                <option value="1009">
                    9호선
                </option>
            </select>
        </div>
         <div id="trainInfo_header" class="ui-grid-b">
            <div class="ui-block-a">역</div>
            <div class="ui-block-b">하행</div>
            <div class="ui-block-c">상행</div>
        </div>       
        <div id="trainInfo" class="ui-grid-b">
        </div>
    </div>
</div>
</body>
</html>
